<%-- 
    Document   : product
    Created on : Sep 3, 2013, 11:56:10 PM
    Author     : Thai Ha Cong
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="description" content="Information about <s:property value="product.name"/>">
        <title><s:property value="product.name"/> - Online Shopping System</title>
        <link href="<%= request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <div class="headerbg">
            <%@include file="include/iHeader.jsp" %>
        </div>
        <div class="contentbg">
            <div class="content1">
                <div class="content2">
                    <div class="contentLeft">
                        <div class="categories">
                            <div class="allCat">ALL CATEGORIES</div>
                            <%@include file="/include/iCategories.jsp"%>
                        </div>
                    </div>
                    <div class="contentRight">
                        <div class="body">
                            <div class="breadcrumb">
                                <s:url action="home" var="homeUrl"></s:url>
                                <s:url action="category" var="categoryUrl">
                                    <s:param name="idCategory"><s:property value="product.category.idCategory"/></s:param>
                                </s:url>

                                <s:a href="%{homeUrl}" title="Home" theme="simple">Home</s:a>
                                >>
                                <a href="<%= request.getContextPath()%>/category/<s:property value='product.category.idCategory'/>/<s:property value='product.category.name.replaceAll(" ", "-")'/>" title="<s:property value="product.category.name"/>">
                                    <s:property value="product.category.name"/>
                                </a>
                                >>
                                <s:property value="product.name"/>
                            </div>
                            <div class="productDetail">
                                <div class="productImage">
                                    <img src="<%= request.getContextPath()%>/<s:property value='product.imageurl'/>" alt="<s:property value='product.name'/>" title="<s:property value='product.name'/>" width="480" height="auto" />
                                </div>
                                <div class="productInfo">
                                    <div class="piName">
                                        <h1><s:property value="product.name"/></h1>
                                    </div>
                                    <div class="piBrand">
                                        Brand: <span class="spanBrand"><s:property value="product.brand"/></span>
                                    </div>
                                    <div class="piCode">
                                        Product Code: <span class="spanCode"><s:property value="product.code"/></span>
                                    </div>
                                    <div class="piPrice">
                                        Price: <b>$<s:property value="getText('{0,number,#,##0.00}',{product.unitPrice})"/></b>
                                    </div>
                                    <div class="piSale">
                                        Sale: <b>$<s:property value="getText('{0,number,#,##0.00}',{product.unitPrice-product.sale})"/></b>
                                    </div>
                                    <s:if test="%{product.stockQuantity==0}">
                                        <div class="piQuantity">
                                            Out of Stock
                                        </div>
                                        <div class="piAddButton">

                                        </div>
                                    </s:if>
                                    <s:else>
                                        <s:form action="addToCart" method="POST" theme="simple">
                                            <div class="piQuantity">
                                                Quantity: 
                                                <s:textfield name="productQuantity" cssStyle="width:26px" value="1" theme="simple"/>
                                            </div>
                                            <div class="piAddButton">
                                                <s:hidden name="productId" value="%{product.idProduct}"></s:hidden>
                                                <s:set var="contextPath"><%= request.getContextPath()%></s:set>
                                                <s:submit type="image" src="%{contextPath}/css/addToCartText.png" theme="simple" title="Add the Product to Cart"/>
                                            </div>
                                        </s:form>
                                    </s:else>
                                    <div class="pSumHead">
                                        Product Summary
                                    </div>
                                    <div class="pSumContent">
                                        <s:property escape="false" value="product.summary.replaceAll(\"\r\n\", \"<br>\")" />
                                    </div>
                                </div>
                                <div class="productDescription">
                                    <div class="pDesHead">
                                        Product Description
                                    </div>
                                    <div class="pDesContent">
                                        <s:property escape="false" value="product.details.replaceAll(\"\r\n\", \"<br>\")" />
                                    </div>
                                </div>
                            </div>
                            <div class="recommendedProducts">
                                <p><b style="font-family: cambria;">Recommended Products</b></p>
                                <s:iterator value="recommendedProducts">
                                    <div class="rProduct">
                                        <div class="rImage">
                                            <a href="<%= request.getContextPath()%>/product/<s:property value='idProduct'/>/<s:property value='name.replaceAll(" ", "-")'/>" title="<s:property value='name + "\r\n" + summary'/>">
                                                <img src="<%= request.getContextPath()%>/<s:property value='imageurl'/>" alt="<s:property value='name'/>" title="<s:property value='name + "\r\n" + summary'/>" width="64" height="auto" />
                                            </a>
                                        </div>
                                        <div class="rInfo">
                                            <div class="rName">
                                                <s:property value="name"/>
                                            </div>
                                            <div class="rPrice">
                                                $<s:property value="getText('{0,number,#,##0.00}',{unitPrice-sale})"/>
                                            </div>
                                        </div>
                                    </div>
                                </s:iterator>
                            </div>
                            <div class="viewedProducts">
                                <p><b style="font-family: cambria;">Viewed Products</b></p>
                                <s:iterator value="recentlyViewedProducts">
                                    <div class="rProduct">
                                        <div class="rImage">
                                            <a href="<%= request.getContextPath()%>/product/<s:property value='idProduct'/>/<s:property value='name.replaceAll(" ", "-")'/>" title="<s:property value='name + "\r\n" + summary'/>">
                                                <img src="<%= request.getContextPath()%>/<s:property value='imageurl'/>" alt="<s:property value='name'/>" title="<s:property value='name + "\r\n" + summary'/>" width="64" height="auto" />
                                            </a>
                                        </div>
                                        <div class="rInfo">
                                            <div class="rName">
                                                <s:property value="name"/>
                                            </div>
                                            <div class="rPrice">
                                                $<s:property value="getText('{0,number,#,##0.00}',{unitPrice-sale})"/>
                                            </div>
                                        </div>
                                    </div>
                                </s:iterator>
                            </div>
                        </div>
                    </div>                    
                </div>
            </div>
        </div>
        <div class="footerbg">
            <%@include file="/include/iFooter.jsp" %>
        </div>
    </body>
</html>
